<template>
	<view class="app-pages index">
		<view class="content">

			<view class="mp_b">
				<view class="">
					<!-- <view class="p_tit">{{ticketData.parkName}}</view> -->
					<view class="tips" @click="show = true">购票须知</view>
					
				</view>
				<view class="app-pirce-color p_price">
					<text style="font-size: 20rpx;">￥</text>
					<text>{{totalPrice || ''}}</text>
				</view>
			</view>

			<view class="cell yd_b">
				<view class="">
					<u-cell :border="true">
						<view class="" slot="title">预订时间</view>
						<view class="" slot="value">
							<view class="cell-right">
								<text style="margin-right: 10rpx;">{{selectDate}}</text>
								<!-- <u-icon name="arrow-right" size="24rpx" color="rgb(144, 147, 153)"></u-icon> -->
							</view>
						</view>
					</u-cell>
					<u-cell :border="false">
						<view class="" slot="title">购买数量</view>
						<view class="" slot="value">
							<view class="cell-right">
								<u-number-box v-model="value" @change="valChange" disabled>
									<view slot="minus" class="minus" >
										<!-- <u-icon name="minus" size="12"></u-icon> -->
									</view>
									<text slot="input" style="width: 30px;text-align: center;"
										class="input">{{value}}</text>
									<view slot="plus" class="plus">
										<!-- <u-icon name="plus" color="#FFFFFF" size="12"  ></u-icon> -->
									</view>
								</u-number-box>
							</view>
						</view>
					</u-cell>
				</view>
			</view>


			<view class="cell userinfo_b">
				<view class="">
					<u-cell :border="false">
						<view class="" slot="title">游客信息</view>
						<!-- <view class="tips" slot="value" @click="handleRouter('/homePages/scenicSpot/passengers')">选择
						</view> -->
					</u-cell>

					<u-cell :border="false">
						<view class="" slot="title">出游人</view>
						<view class="tips" slot="value">
							<!-- <u--input border="bottom" placeholder="请输入出游人" v-model="userName" :customStyle="{
								 width:'400rpx'
							 }" /> -->
							 <text>{{userName}}</text>
						</view>
					</u-cell>

					<u-cell :border="false">
						<view class="" slot="title">手机号</view>
						<view class="tips" slot="value">
							<!-- 	<u--input border="bottom" placeholder="请输入手机号"   maxlength="11" name="telephone"  type="number"
								  v-model="userPhone" :customStyle="{
									width:'400rpx'
								}" /> -->
							<text>{{userPhone}}</text>
						</view>
					</u-cell>

					<u-cell :border="false">
						<view class="" slot="title">身份证</view>
						<view class="tips" slot="value">
							<!-- <u--input border="bottom" placeholder="请输入身份证" maxlength="18" 
							   type="number" v-model="userCard" :customStyle="{
								width:'400rpx'
							}" /> -->
							<text>{{userCard}}</text>
						</view>
					</u-cell>
				</view>
			</view>
		</view>
		<!-- 购票须知 -->
		<u-popup :show="show" mode="center">
			<view class="popup">
				<view class="cell">
					<u-cell :border="true">
						<view class="" slot="title">购票须知</view>
						<view class="" slot="value">
							<u-icon @click="show = false" name="close-circle" size="30rpx" color="rgb(144, 147, 153)">
							</u-icon>
						</view>
					</u-cell>
					<view class="padding">

						<u-cell :border="false">
							<view class="tips" slot="title">入塔须知</view>
							<text class="label" slot="label">
								1、开放时间：08:30-22:00；
								2、所有票型一经验证不予退款；
								3、门票当天有效，出园需入园，需再次购票；
								4、为保证入园顺利，预订时务必填写真实姓名、手机号等信息
							</text>
						</u-cell>

						<!-- <u-cell :border="false">
							<view class="tips" slot="title">入塔须知</view>
							<text class="label" slot="label">
								1、开发时间：08:30-22:00；
								2、所有票型一经验证不予退款；
								3、门票当天有效，出园需入园，需再次购票；
								4、为保证入园顺利，预订时务必填写真实姓名、手机号等信息
							</text>
						</u-cell> -->
					</view>
				</view>
			</view>
		</u-popup>



		<!-- 底部按钮 -->
		<view class="btn app-pages" v-if="false">
			<view class="btn-left"  >
				<text>应付金额：</text>
				<text class="app-pirce-color" >
					<text style="font-size: 26rpx;">￥</text>
					<text>
						{{totalPrices}}
					</text>
					
				</text>
			</view>
			<view class="btn-right">
				<view class="button">
					<view class="submit" @click="addlist">提交订单</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
import idCardNumberVerify from "./idCardNumber/index.js"
import { orderDetails } from "@/http";

	export default {
		data() {
			return {
				totalPrices:0.1,
				list: [],
				value: 1,
				show: false,
				userCard: '',
				userName: '',
				userPhone: '',
				selectDate: '',
				ticketData: '',
				codelist:[],
				data:[],
				phoneNum:null,
				dataFrom: {
				idCardNumber: null,	
				pohone:null,
				
				},
				totalPrice:null

				
			}
		},
		async onLoad(o) {
			if(o.storeOrderId){
				let res = await orderDetails(o.storeOrderId);
				// console.log('order_details::',res.data.data);
				this.userCard = res.data.data.f1;
				this.userName = res.data.data.userName;
				this.userPhone = res.data.data.userPhone;
				this.value = res.data.data.totalNum;
				// this.selectDate = res.data.data.updateTime; //预订时间
				// this.ticketData.productPrice = res.data.data.totalPrice;
				this.totalPrice = res.data.data.totalPrice;
				
				
				// console.log(this.totalPrice);
				this.$forceUpdate();
			}else{
				this.ticketData = JSON.parse(o.data);
				this.selectDate = o.date;
			}
		},
		onInput(e){
		     this.phoneNum = e.detail.value
		},
		mounted() {
			// this.addlist()
		},
		onShow() {
			let selectUser = uni.getStorageSync('people_data')
			if (selectUser) {
				let people = JSON.parse(selectUser)
				this.userCard = people.userCard
				this.userName = people.userName
				this.userPhone = people.userPhone
			}
		},
		methods: {
			valChange(e){
				this.totalPrice = e.value * this.ticketData.productPrice;
				this.totalPrices = this.totalPrice.toFixed(1);
				console.log(this.totalPrices)
			},
			
			handleRouter(url) {
				uni.navigateTo({
					url
				})
			},
			submit() {
				// /homePages/scenicSpot/orderDetails

			},
			addlist() {
				            const phone = /^1[3456789]\d{9}$/;
				            if (!phone.test(this.userPhone)) {
				                return uni.showToast({
				                    title: "手机号格式错误",
				                    icon: 'none'
				                })
				
				            }
				      const userCard = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; 
				            if (!userCard.test(this.userCard)) {
				                return uni.showToast({
				                    title: "身份证格式错误",
				                    icon: 'none'
				                })
				            }
					
				uni.showLoading({
					title:'正在提交',
					mask:true
				})
				let params = {
					productList: [{
						"date": this.selectDate,
						"productCode": this.ticketData.productCode,
						"productId": this.ticketData.productId,
						"productName": this.ticketData.productName,
						"productNum": this.value,
						"productPrice": this.ticketData.productPrice,
					}, ],
					userCard: this.userCard,
					userName: this.userName,
					userPhone: this.userPhone
				}
				this.$http.getushow(params).then(res => {
					
					console.log(res.msg)
					if(res.data.code!=200) return uni.showToast({
						title:res.data.msg
					})
					
					
					let data=res.data.data
					
					console.log(data.totalPrice)
					
					this.weixinPay(data.totalPrice,data.orderId)
					 			
					
					
					// handleRouter('/homePages/scenicSpot/orderDetails')
				})

			},
			weixinPay(totalPrice, orderId) {
				this.$http.getTicketOrderPay({
					payAmount: totalPrice+'',
					thirdOrderId: orderId,
					thirdType: '3',
					payPattern: '1'
				}).then(res => {
					let codelist = res.data.weChatPayDTO
					let that=this
					uni.requestPayment({
					     provider: 'wxpay', //
					     timeStamp: codelist.timeStamp,
					     nonceStr: codelist.nonceStr,   
					     package: codelist.packageStr,
					     signType: 'MD5', //不可变
					     paySign: codelist.paySign,
					     success: function(res) {
					      //支付成功的回调    
					      uni.showToast({
					       title: '支付成功！',
					       icon: 'success'
					      }) //付款了才会调下面的接口
						  that.$http.setTicketPaySuccess({
							  thirdOrderId :orderId,
							  thirdType :'3',
							  wxPayType :'2' 
						  }).then(res=>{
							  console.log(res); //这个接口成功后
							  //这里判断一下code状态200就可以跳转了  /homePages/scenicSpot/index
							  if(res.data.code==200){
								wx.navigateTo({
									url: '/homePages/scenicSpot/orderDetails'
								})  
							  }
							  
						  })
						  
					     },
					     fail: function(err) {
					      //支付失败的回调   
					      console.log(err);
					
					     }
					    });

				})
			}

		},

	}
</script>
<style lang="scss" scoped>
	.index {
		background-color: #F6F6F6;
		min-height: 100vh;
		overflow: auto;
	}

	.content ::v-deep .u-cell__body {
		padding: 20rpx 0 !important;
	}

	.content {
		padding-bottom: calc(110rpx + env(safe-area-inset-bottom));
	}

	.btn {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		padding-bottom: env(safe-area-inset-bottom);
		height: 120rpx;
		display: flex;
		align-items: center;
		background-color: #FFFFFF;
		font-size: 40rpx;
		box-shadow: 0 -1rpx 4rpx #ccc;
		z-index: 99;

		.btn-right {
			flex: 1;
			display: flex;
			justify-content: flex-end;
			align-items: center;
		}

		.button {
			padding-left: 30rpx;

			.submit {
				padding: 15rpx 35rpx;
				border-radius: 10rpx;
				color: #FFFFFF;
				background-color: #D9001B;
			}
		}

		.btn-left {
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}

	.popup {
		width: 700rpx;

		.cell {
			box-shadow: none;
			margin-top: 0;

			.label {
				padding-left: 30rpx;
				padding-top: 20rpx;
			}

			.padding {
				padding: 0 40rpx;
			}
		}
	}

	.cell {
		margin-top: 30rpx;
		// box-shadow: 0 0 4rpx #ccc;
	}

	.tips {
		padding-top: 20rpx;
		font-size: 26rpx;
		color: #F59A23;
	}

	.cell-right {
		display: flex;
		align-items: center;
	}

	.padding {
		padding: 20rpx 40rpx 20rpx 40rpx;
	}

	.mp_b {
		display: flex;
		align-items: center;
		justify-content: space-between;
		background-color: #fff;
		padding: 30rpx;
		border-radius: 10rpx;

		.p_tit {
			font-size: 36rpx;
			font-weight: 600;
		}

		.p_price {
			font-size: 32rpx;
		}
	}

	.yd_b {
		padding: 30rpx;
		background-color: #fff;
	}

	.userinfo_b {
		padding: 30rpx;
		background-color: #fff;
	}



	.input {
		padding: 0 10px;
	}

</style>
